<template>
	<view class="">
		<view>
			
		</view>
		<image class="height100vh image posiab" src="/static/img/bbg.jpg"></image>
		<view class="flex-ju-c height100vh posire zindex5">
			<view class="posire">
				<view class="posiab width1000">
					<view class="pg15-30">
						<view class="flex-ju-b size28 ">
							<view class="flex-a-i">
								<image mode="widthFix" class="image width60 mr15" src="/static/img/tupiamg.png"></image>
								融合通讯调度平台
							</view>
							<view class="flex-a-i color333">
								<view class="flex-a-i mr50">
									<image mode="widthFix" class="image width50" src="/static/img/xiazai.png"></image>
									下载中心
								</view>

								<view class="flex-a-i mr50">
									<image mode="widthFix" class="image width50" src="/static/img/shezhi.png"></image>
									设置
								</view>
								<image mode="widthFix" class="image width50 mr50" src="/static/img/heng.png"></image>
								<image mode="widthFix" class="image width50 mr50 " src="/static/img/da.png"></image>
								<image mode="widthFix" class="image width50" src="/static/img/bi.png"></image>
							</view>
						</view>
					</view>

					<view class="pg15-20 flex-ju-c  height1100 ">
						<view class="mt200 ">
							<view class="flex-a-i color333 height90">
								<view class="flex-a-i posire">
									<view class="flex-a-i " @click="showinfo">
										<image mode="widthFix" class="image mr15 width110" src="/static/img/xaing.png">
										</image>
										<view>张启零</view>
									</view>

									<view class="posiab top140 zindex1115 hidden "
										:class="isamate?'sanimation':'animation'">
										<view class="bgf6faff ra20 pg30 ">
											<view class="width600 ">
												<view class="flex-a-i ">
													<image mode="widthFix" class="image mr15 width110"
														src="/static/img/xaing.png"></image>
													<view>
														<view @click="tapinfo" class="flex-a-i size36">
															张启零
															<image mode="widthFix" class="image ml15 width36"
																src="/static/img/bianju.png"></image>
														</view>
														<view class="flex-a-i size28 color666">
															我的云会议室：8086013345
															<image mode="widthFix" class="image ml15 width36"
																src="/static/img/copy.png"></image>
														</view>
													</view>
												</view>
											</view>
											<view class="color666 size28">
												<view class="mt20 mb20">登录名：zhangqiling</view>
												<view>所属组织：某某某组织</view>
											</view>
											<view class="bgfff pg30 ra10 size32 mt30 flex-ju-b hover">
												<view class="flex-a-i">
													<image mode="widthFix" class="image mr15 width50"
														src="/static/img/bendiziyuan.png"></image>
													本地资源
												</view>
												<image mode="widthFix" class="image  width50"
													src="/static/img/zright.png"></image>
											</view>
											<view @click="tapposs" class="bgfff hover pg30 ra10 size32 mt15 flex-ju-b">
												<view class="flex-a-i">
													<image mode="widthFix" class="image mr15 width50"
														src="/static/img/mima.png"></image>
													修改密码
												</view>
												<image mode="widthFix" class="image  width50"
													src="/static/img/zright.png"></image>
											</view>
											<view @click="tapout" class="bgfff hover pg30 ra10 size32 mt15 flex-ju-b">
												<view class="flex-a-i">
													<image mode="widthFix" class="image mr15 width50"
														src="/static/img/tuichu.png"></image>
													退出登录
												</view>
											</view>


										</view>



									</view>
								</view>

								<view class="wh300-90 bge8efff flex-ju-c posiab right0"
									style="border-bottom-left-radius:20px;border-top-left-radius:20px;">
									<view class="color000 flex-a-i ml20">
										待参加的会议
										<image mode="widthFix" class="image width45" src="/static/img/rights.png">
										</image>
									</view>
								</view>
							</view>

							<view class="flex-ju-c size32 flex-col ">
								<view class="flex-a-i mt130 mb200">
									<view class="colorfff flex-ju-c posire zindex0">
										<image mode="heightFix" class="image height456" src="/static/img/shishi.png">
										</image>
										<view class="posiab mt160">实时监控</view>
									</view>
									<view class="colorfff flex-ju-c posire mr33 ml33 zindex0">
										<image mode="heightFix" class="image height456 " src="/static/img/shiping.png">
										</image>
										<view class="posiab mt160">视频通话</view>
									</view>
									<view class="flex-ju-b flex-col height456">
										<view class="bgfff flex-ju-c wh448-212 ra40 mr33">
											<image mode="heightFix" class="image mr25 height144"
												src="/static/img/yuyue.png"></image>
											预约会议
										</view>
										<view class="bgfff flex-ju-c wh448-212 ra40 mr33">
											<image mode="heightFix" class="image mr25 height144"
												src="/static/img/luxiang.png"></image>
											录像回放
										</view>
									</view>
									<view class="flex-ju-b flex-col height456">
										<view class="bgfff flex-ju-c wh448-212 ra40">
											<image mode="heightFix" class="image mr25 height144"
												src="/static/img/jiaru.png"></image>
											加入会议
										</view>
										<view class="bgfff flex-ju-c wh448-212 ra40">
											<image mode="heightFix" class="image mr25 height144"
												src="/static/img/yuyin.png"></image>
											语音广播
										</view>
									</view>

								</view>
							</view>

							<view class="width1000 color303133 size32 flex-ju-c">
								<view class="bgfff flex-ju-c wh208-212 flex-col ra40">
									<image mode="heightFix" class="image mb10 height104" src="/static/img/faqi.png">
									</image>
									<view>发起会议</view>
								</view>
								<view class="bgfff flex-ju-c  ml70 wh208-212 flex-col ra40">
									<image mode="heightFix" class="image mb10 height104" src="/static/img/lunxun.png">
									</image>
									<view>轮巡计划</view>
								</view>
								<view class="bgfff flex-ju-c mr70 ml70 wh208-212 flex-col ra40">
									<image mode="heightFix" class="image mb10 height104" src="/static/img/baojing.png">
									</image>
									<view>报警管理</view>
								</view>
								<view class="bgfff flex-ju-c wh208-212 flex-col ra40">
									<image mode="heightFix" class="image mb10 height104" src="/static/img/bendi.png">
									</image>
									<view>本地资源</view>
								</view>
							</view>
						</view>

					</view>
				</view>
				<image mode="widthFix" class="image width1100px" src="/static/img/changko.png"></image>

			</view>
		</view>
		
		<poup ref="showmode" mode="center" confirm="保存">
			<view class="flex-a-i">
				<view class="width250 text-right">姓名：</view><input class="borderced4db wh480-80 pl20 ra5"
					placeholder="请输入姓名" />
			</view>
			<view class="flex-a-i mt40 mb40">
				<view class="width250 text-right">登录名：</view>
				<input class="borderced4db wh480-80 pl20 ra5" placeholder="请输入登录名" />
			</view>
			<view class="flex-a-i">
				<view class="width250 text-right">所属组织：</view><input class="borderced4db wh480-80 pl20 ra5"
					placeholder="请输入组织" />
			</view>
		</poup>
		<poup ref="showsetpoww" mode="center" confirm="确定">
			<view class="flex-a-i">
				<view class="width250 text-right"><text class="colorFC474C">*</text>原密码：</view><input
					class="borderced4db wh480-80 pl20 ra5" placeholder="请输入姓名" />
			</view>
			<view class="flex-a-i mt40 mb40">
				<view class="width250 text-right"><text class="colorFC474C">*</text>新密码：</view>
				<input class="borderced4db wh480-80 pl20 ra5" placeholder="请输入登录名" />
			</view>
			<view class="flex-a-i">
				<view class="width250 text-right"><text class="colorFC474C">*</text>确认密码：</view><input
					class="borderced4db wh480-80 pl20 ra5" placeholder="请输入组织" />
			</view>
		</poup>
		<tishi ref="showtishi" title="您确定要退出登录吗？"></tishi>
		<uni-popup ref="showpeizhi" mode="center">
			<view class="bgfff ra15 width1440 posire pt30 ">
				<view class="flex-ju-c size36 color333 bold border-bebecef pb30">应用配置</view>
				<image @click="$refs.kk.close()" mode="widthFix" class="image posiab right30 top30 width50"
					src="/static/img/bi.png"></image>
				<view class="flex size28">

					<view class="bgfafafa height900">

						<view class="flex-a-i wh240-104 pl40 hover">
							<image mode="widthFix" class="image mr15 width40" src="/static/img/peizhi.png"></image>
							应用配置
						</view>
						<view class="flex-a-i wh240-104 pl40 hover">
							<image mode="widthFix" class="image mr15 width40" src="/static/img/ruhui.png"></image>
							入会视频
						</view>
						<view class="flex-a-i wh240-104 pl40 hover">
							<image mode="widthFix" class="image mr15 width40" src="/static/img/yinping.png"></image>
							入会音频
						</view>
						<view class="flex-a-i wh240-104 pl40 hover">
							<image mode="widthFix" class="image mr15 width40" src="/static/img/jiankong.png"></image>
							监控设置
						</view>
						<view class="flex-a-i wh240-104 pl40 hover">
							<image mode="widthFix" class="image mr15 width40" src="/static/img/guanyu.png"></image>
							关于
						</view>
					</view>

					<view v-if="0" class="mt20  pb50">
						<view class="size28 color333  flex-a-i  mb40 ml40">
							<view class="wh6-30 mt8 bg2C7BFF mr15"></view>已添加功能<text class="color999">（拖动可排序）</text>
						</view>
						<view class="flex color333 ml40 flex-wrap">
							<view class="bgF6F6F6 wh224-212 flex-ju-c flex-col ra12  posire">
								<image mode="heightFix" class="image posiab height50 top-20 right-20"
									src="/static/img/qu.png"></image>
								<image mode="heightFix" class="image mb15 height64" src="/static/img/shishis.png">
								</image>
								实时监控
							</view>
							<view class="bgF6F6F6 wh224-212 flex-ju-c flex-col ra12  mr50 ml50 posire">
								<image mode="heightFix" class="image posiab height50 top-20 right-20"
									src="/static/img/qu.png"></image>
								<image mode="heightFix" class="image mb15 height64" src="/static/img/shipings.png">
								</image>
								实时监控
							</view>
							<view class="height212 flex-ju-b flex-col size24">
								<view class="bgF6F6F6 wh224-96 flex-ju-c  ra12  posire">
									<image mode="heightFix" class="image posiab height50 top-20 right-20"
										src="/static/img/qu.png"></image>
									<image mode="heightFix" class="image mr10 height64" src="/static/img/yuyue.png">
									</image>
									预约会议
								</view>
								<view class="bgF6F6F6 wh224-96 flex-ju-c  ra12  posire">
									<image mode="heightFix" class="image posiab height50 top-20 right-20"
										src="/static/img/qu.png"></image>
									<image mode="heightFix" class="image mr10 height64" src="/static/img/yuyue.png">
									</image>
									预约会议
								</view>
							</view>
							<view class="height212 flex-ju-b flex-col ml50 size24">
								<view class="bgF6F6F6 wh224-96 flex-ju-c  ra12  posire">
									<image mode="heightFix" class="image posiab height50 top-20 right-20"
										src="/static/img/qu.png"></image>
									<image mode="heightFix" class="image mr10 height64" src="/static/img/yuyue.png">
									</image>
									预约会议
								</view>
								<view class="bgF6F6F6 wh224-96 flex-ju-c  ra12 posire ">
									<image mode="heightFix" class="image posiab height50 top-20 right-20"
										src="/static/img/qu.png"></image>
									<image mode="heightFix" class="image mr10 height64" src="/static/img/yuyue.png">
									</image>
									预约会议
								</view>
							</view>

							<view class="bgF6F6F6 wh144-144 flex-ju-c flex-col ra12 size24 mt50 posire">
								<image mode="heightFix" class="image posiab height50 top-20 right-20"
									src="/static/img/qu.png"></image>
								<image mode="heightFix" class="image mb10 height64" src="/static/img/faqi.png"></image>
								发起会议
							</view>
							<view class="bgF6F6F6 wh144-144 flex-ju-c flex-col ra12 size24 mt50 ml50 posire">
								<image mode="heightFix" class="image posiab height50 top-20 right-20"
									src="/static/img/qu.png"></image>
								<image mode="heightFix" class="image mb10 height64" src="/static/img/lunxun.png">
								</image>
								轮巡计划
							</view>
							<view class="bgF6F6F6 wh144-144 flex-ju-c flex-col ra12 size24 mt50 ml50 posire">
								<image mode="heightFix" class="image posiab height50 top-20 right-20"
									src="/static/img/qu.png"></image>
								<image mode="heightFix" class="image mb10 height64" src="/static/img/baojing.png">
								</image>
								报警管理
							</view>
							<view class="bgF6F6F6 wh144-144 flex-ju-c flex-col ra12 size24 mt50 ml50 posire">
								<image mode="heightFix" class="image posiab height50 top-20 right-20"
									src="/static/img/qu.png"></image>
								<image mode="heightFix" class="image mb10 height64" src="/static/img/bendi.png"></image>
								本地资源
							</view>
						</view>

						<view class="size28 color333 ml40 flex-a-i  mb40 mt50 ">
							<view class="wh6-30 mt8 bg2C7BFF mr15"></view>未添加功能
						</view>

						<view>
							<view class="dashedborder ml40 wh144-144 ra12 posire">
								<image mode="heightFix" class="image posiab height50 top-20 right-20"
									src="/static/img/jia.png"></image>
							</view>
						</view>

						<view class="border-teeeff1 mt100">
							<view class="flex-row mr60 mt50">
								<view class="flex-a-i ">
									<view @click="$refs.kk.close()" class="wh152-64 borderd0d6dc flex-ju-c ra5">取消
									</view>
									<view class="wh152-64 border165FFF colorfff bg165FFF flex-ju-c ml60 ra5">确定</view>
								</view>
							</view>
						</view>
					</view>

					<view v-if="0" class="mt20  pb50 ml40">
						<view class="bgdddddd wh1044-608 ra20 flex-ju-c">
							<image mode="widthFix" class="image mr15 width152" src="/static/img/noshe.png"></image>
						</view>
						<view class="flex-a-i mt50">
							<view style="white-space: nowrap;">视频源：</view>
							<el-input disabled placeholder="未检测到摄像头设备" />
						</view>
						<view class="flex-a-i mt50 mb30">
							<view style="white-space: nowrap;">视频源：</view>
							<el-select v-model="value" placeholder="Select" size="large" style="width: 240px">
								<el-option v-for="item in options" :key="item.value" :label="item.label"
									:value="item.value" />
							</el-select>
						</view>

						<el-checkbox label="本地视频镜像" size="large" />
						<view class=""> </view>
						<el-checkbox label="入会时关闭摄像头" size="large" />

					</view>
					<view v-if="0" class="mt20  pb50 ml40">
						<view class="size28 color333  flex-a-i  mb40 bold">
							<view class="wh6-30  bg2C7BFF mr15"></view>麦克风
						</view>
						<view class="flex-a-i color333">
							选择设备：
							<el-select v-model="value" disabled placeholder="Select" style="width:650rpx">
								<el-option v-for="item in options" :key="item.value" :label="item.label"
									:value="item.value" />
							</el-select>
							<el-button type="primary" class="bg165DFF ml20">检测麦克风</el-button>
						</view>

						<view class="flex-a-i mt30 mb10 color333">
							输入等级：<image mode="widthFix" class="image  width32" src="/static/img/mfeng.png"></image>
							<el-progress style="width:600rpx" class="ml20" :text-inside="true" :stroke-width="6"
								:percentage="0" />
						</view>

						<el-checkbox label="入会时关闭麦克风" class="color333" size="large" />

						<view class="size28 color333  flex-a-i mt20 mb40 bold">
							<view class="wh6-30  bg2C7BFF mr15"></view>扬声器
						</view>
						<view class="flex-a-i color333">
							选择设备：
							<el-select v-model="value" disabled placeholder="Select" style="width:650rpx">
								<el-option v-for="item in options" :key="item.value" :label="item.label"
									:value="item.value" />
							</el-select>
							<el-button type="primary" class="bg165DFF ml20">检测扬声器</el-button>
						</view>
						<view class="flex-a-i mt30 mb10 color333">
							输出等级：<image mode="widthFix" class="image  width32" src="/static/img/mfeng.png"></image>
							<el-progress style="width:600rpx" class="ml20" :text-inside="true" :stroke-width="6"
								:percentage="0" />
						</view>

						<view class="flex-a-i color333">
							输出音量：
							<slider class="width500 " value="50" @change="sliderChange" show-value />
						</view>

						<view class="size28 color333  flex-a-i mt20 mb40 bold">
							<view class="wh6-30  bg2C7BFF mr15"></view>扬声器
						</view>

						<el-checkbox label="回声消除" class="color333" size="large" />
						<el-checkbox label="自动增益控制" class="color333" size="large" />
						<el-checkbox label="自动噪音抑制" class="color333" size="large" />

					</view>

					<view v-if="0" class="mt20  pb50 ml40">
						<view class="size28 color333  flex-a-i  mb40 bold">
							<view class="wh6-30  bg2C7BFF mr15"></view>基本配置
						</view>
						<view class="flex-ju-b">
							<view class="flex-a-i">
								<view class="width170">启动窗口数：</view>
								<el-select v-model="value" disabled placeholder="Select" class="width300">
									<el-option v-for="item in options" :key="item.value" :label="item.label"
										:value="item.value" />
								</el-select>
							</view>

							<view class="flex-a-i">
								<view class="ml100">码流类型：</view>
								<el-select v-model="value" disabled placeholder="Select" class="width300">
									<el-option v-for="item in options" :key="item.value" :label="item.label"
										:value="item.value" />
								</el-select>
							</view>

						</view>
						<view class="flex-a-i">
							<view class="mt50 width170">自动退出：</view>
							<el-select v-model="value" disabled placeholder="Select" class="width300 mt50">
								<el-option v-for="item in options" :key="item.value" :label="item.label"
									:value="item.value" />
							</el-select>
						</view>


						<view class="flex-ju-b">
							<el-checkbox label="报警声音" class="color333" size="large" />
							<view class="flex-a-i">
								报警声音关闭(秒)：<el-input class="width240" placeholder="15"></el-input>
							</view>
						</view>
						<view class="flex-ju-b">
							<el-checkbox label="即时回放" class="color333" size="large" />
							<view class="flex-a-i">
								即时回放时间(秒)：<el-input class="width240" placeholder="15"></el-input>
							</view>
						</view>
						<view class="flex-ju-b">
							<el-checkbox label="持续获取云台位置" class="color333" size="large" />
							<el-checkbox label="报警联动提示" class="color333 mr270" size="large" />
						</view>

						<view class="size28 color333  flex-a-i mt20 mb40 bold">
							<view class="wh6-30  bg2C7BFF mr15"></view>抓图设置
						</view>

						<view class="flex-ju-b">
							<view class="flex-a-i">
								<view class="width170">图片格式：</view>
								<el-select v-model="value" disabled placeholder="Select" class="width300">
									<el-option v-for="item in options" :key="item.value" :label="item.label"
										:value="item.value" />
								</el-select>
							</view>

							<view class="flex-a-i">
								<view class="ml100">连续抓图(张)：</view>
								<el-input placeholder="3" class="width256"></el-input>
							</view>

						</view>

						<view class="flex-a-i mt30">
							<view class="">连续抓图间隔(秒)：</view>
							<el-input placeholder="3" class="width256"></el-input>
						</view>

						<view class="flex-a-i mt30">
							<view class="">抓图保存路径：</view>
							<el-input placeholder="3" disabled class="width560 "></el-input>
							<view class="wh124-64 flex-ju-c ra5 color333 bgEBECEF ml15">更改</view>
						</view>

						<view class="size28 color333  flex-a-i mt20 mb40 bold mt40 pt40 border-tf5f7fa">
							<view class="wh6-30  bg2C7BFF mr15"></view>录像/下载设置
						</view>
						<view class="flex-a-i mt30">
							<view class="">最大录像时间(分)：</view>
							<el-input placeholder="3" class="width256"></el-input>
						</view>
						<view class="flex-a-i mt30">
							<view class="">录像保存路径：</view>
							<el-input placeholder="3" disabled class="width560"></el-input>
							<view class="wh124-64 flex-ju-c ra5 color333 bgEBECEF ml15">更改</view>
						</view>

						<view class="border-teeeff1 mt100">
							<view class="flex-row mr60 mt50">
								<view class="flex-a-i ">
									<view @click="$refs.kk.close()" class="wh152-64 borderd0d6dc flex-ju-c ra5">默认配置
									</view>
									<view class="wh152-64 border165FFF colorfff bg165FFF flex-ju-c ml60 ra5">确定</view>
								</view>
							</view>
						</view>

					</view>

					<view v-if="1" class="mt20 flex-ju-c pb50 width1000 flex-col ">
						<view class=" ">
							<image mode="widthFix" class="image  width128" src="/static/img/imgguanyu.png"></image>
						</view>
						<view class="color333 size32 bold mt50">融合视讯调度平台</view>
						<view class="color666 size28 mt40">当前版本v1.0.0</view>
					</view>
				
				</view>




			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isamate: false,
				value: "高清",
				options: [{
					value: 'Option1',
					label: 'Option1',
				}]
			}
		},
		onLoad() {

		},
		mounted() {
			this.$refs.showpeizhi.open()
		},
		methods: {
			tapout() {
				this.$refs.showtishi.show()
			},
			tapposs() {
				this.$refs.showsetpoww.show()
			},
			tapinfo() {
				this.$refs.showmode.show()
			},
			showinfo() {
				this.isamate = !this.isamate
			}
		}
	}
</script>

<style>
	.hover:hover {
		background: #e0eaff;
	}

	.dashedborder {
		border: 1px dashed #E6E6E6;
	}
</style>